<template>
  <div class="box-header">{{ title }}</div>
</template>

<script setup>
import { defineProps } from 'vue'

// 自定义 props
const props = defineProps({
  bgcolor: {
    type: String,
    default: '#0d6efd'
  },
  color: {
    type: String,
    default: '#fff'
  },
  title: {
    type: String,
    default: ''
  }
})
</script>

<style lang="less" scoped>
.box-header {
  position: fixed;
  top: 0;
  left: 0;
  height: 45px;
  width: 100%;
  z-index: 99;
  background-color: v-bind('props.bgcolor');
  color: v-bind('props.color');
  font-size: 12px;
  text-align: center;
  line-height: 45px;
}
</style>
